<script lang="ts" setup>
import type { ClassApi } from '@/apis'

defineProps<{
  active?: boolean
  data: ClassApi.StudentClassResp
}>()
</script>

<template>
  <view class="card border" :class="{ active }">
    <view>
      <!-- <wd-tag type="primary">
        <text>{{ useDictLabel('ClassCategoryEnum', data.classCategory) }}</text>
      </wd-tag> -->
      <text class="border-rd-4rpx bg-[#ee8432] p-6rpx text-13px color-white">
        {{ useDictLabel('ClassCategoryEnum', data.classCategory) }}
      </text>
      <text class="ml-1 flex-1 fw-500 text-main">
        {{ data.name }}
      </text>
    </view>
    <view class="mt-4px font-size-[24rpx] color-gray-5 line-1">
      <text>
        {{ data.arrangeTemplate.startDate }}~{{ data.arrangeTemplate.endDate }} ·
      </text>
      <text class="ml-1">
        {{ data.timeTemplate.startTime }}-{{ data.timeTemplate.endTime }}
      </text>
    </view>
    <view class="mt-4px font-size-[24rpx] color-gray-5">
      {{ data.campusName }}校区·{{ data.leadTeacherName }}老师
    </view>
  </view>
</template>

<style scoped>
  .border {
    border: 1px solid transparent;
  }

  .active {
    border-color: #33AD7C;
    background: #ECFFF8 !important;
  }
</style>
